<template>
	<view class="my-deal">
		<u-tabs-swiper class="tabs-swiper" ref="uTabs" bg-color="#ffffff" bar-width="30" :list="list" :is-scroll="false"
		 :current="current" @change="tabsChange">
		</u-tabs-swiper>
		<swiper :style="tatalHeight" :current="swiperCurrent" @transition="transition" @animationfinish="animationfinish">
			<view v-if="true">
				<view v-for="(item,index) in list" :key="index">
					<swiper-item class="swiper-item">
						<image src="../../../static/缺省页2_03.jpg"></image>
						<view class="goIssue">暂无数据</view>
						<view class="now">点击重试</view>
					</swiper-item>
				</view>
			</view>
		</swiper>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tatalHeight: "",
				list: [{
					name: '全部'
				}, {
					name: '交易中'
				}, {
					name: '审核中',
				}, {
					name: '未通过',
				}, {
					name: '已成交',
				}],
				current: 0,
				swiperCurrent: 0,
			}
		},
		onLoad() {
			let self = this
			let query = uni.createSelectorQuery().in(this);
			query.select('#label').boundingClientRect(data => {
				if (false) {
					self.tatalHeight = "height:" + (data.height * self.items.length * 2 + 296) + "rpx;"
				} else {
					self.tatalHeight = "height:95vh"
				}
			}).exec();
		},
		methods: {
			tabsChange(index) {
				this.swiperCurrent = index;
			},
			transition(e) {
				let dx = e.detail.dx;
				this.$refs.uTabs.setDx(dx);
			},
			animationfinish(e) {
				let current = e.detail.current;
				this.$refs.uTabs.setFinishCurrent(current);
				this.swiperCurrent = current;
				this.current = current;
				let self = this
				let query = uni.createSelectorQuery().in(this);
				query.select('#label').boundingClientRect(data => {
					if (this.swiperCurrent == 0) {
						if (false) {
							self.tatalHeight = "height:" + (data.height * self.items.length * 2 + 296) + "rpx;"
						} else {
							self.tatalHeight = "height:100vh"
						}
	
					} else if (this.swiperCurrent == 1) {
						self.tatalHeight = "height:" + (data.height * self.isTest.length * 2 + 296) + "rpx;"
					} else {
						self.tatalHeight = "height:" + (data.height * self.items.length * 2 + 296) + "rpx;"
					}
				}).exec();
			},
		}
	}
</script>

<style lang="scss" scoped>
	.my-deal {
		background: #EFF0F5;

		.swiper-item {
			display: flex;
			flex-direction: column;
			align-items: center;
			image {
				margin-top: 100rpx;
				width: 300rpx;
				height: 300rpx;
			}

			.goIssue {
				font-size: 32rpx;
			}

			.now {
				border: solid 1px #007AFF;
				color: #007AFF;
				border-radius: 10rpx;
				padding: 10rpx 20rpx;
				margin-top: 50rpx;
			}
		}
	}
</style>
